閱讀前，建議可以參考Day1：閱讀指南＆為何選擇這個題目？

▌挑戰簡介

• 題目：三十天用Vue.jS打造一個網路商城

• 挑戰內容：利用慕課網（IMOOC）的「Vue2.0+Node.js+MongoDB 全棧打造商城系統」＆六角學院的「Vue出一個電商網站」的課程嘗試在30天內打造網路商城。

• 本篇性質：純粹學習進度的紀錄，不會有詳細的教學或解釋，因此不適合認真閱讀

▌安裝

• 安裝bootstrap套件
  npm install bootstrap --save
• 安裝node-sass和sass-loader (for use scss lang)
  npm install node-sass sass-loader --save

▌引入bootstrap

• ~可以引用module
• style lang="scss" 記得改成scss

#app.vue
<style lang="scss">  // node-sass sass-loader need 
@import "~bootstrap/scss/bootstrap"; //bootstrap need
</style>

只要這個引用了，就可以使用bootstrap的class了

#像是這個代碼
 <button type="button" class="btn btn-primary">Primary</button>

▌客制SCSS

• assets-helper folder複製一個_variables.scss
• assets folder開一個all.scss
• all.scss裡面的import順序很重要，不能亂換！！大坑
• _variables.scss可以自己更改顏色

#app.vue
<style lang="scss"> 
@import "./assets/all.scss";
</style>

#all.scss
@import "~bootstrap/scss/_functions";
@import "./helper/variables";
@import "~bootstrap/scss/bootstrap";